<html><head>
    <title>喜迎吉林省妇女十四大，一起为盛会打CALL!</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <link rel="stylesheet" href="css/style1.css?id=111">
    <script src="./js/jquery-1.6.1.min.js"></script>

    <script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"  type="text/javascript"></script>
    <script src="http://h5.jlrbyy.cn/wxjson/js/wxapi-wm.js?v=1.4"  type="text/javascript"></script> 
<style>
  .f24{ font-family:"微软雅黑";color: #ff6600;}
  .up{
    width: 60px;height: 60px;position: absolute;z-index: 1;bottom: 25px;
  
  }
  /* 定义淡入动画 */
@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
 
/* 定义淡出动画 */
@keyframes fadeOut {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}
 
/* 应用动画 */
.up {
    animation: fadeIn 2s ease-in forwards, fadeOut 2s ease-out 2s infinite;
}
</style>
  </head>
<script>
  let u = navigator.userAgent
  let isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //g
  let isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
  if (isAndroid) {
 window.location.href='index.html'
  }
  if (isIOS) {
  　　//window.location.href='ios.html'

  }
  
</script>
<script>
    document.addEventListener(
        'WeixinJSBridgeReady',
        function () {
            changeClass()
        },
        false
    )
 
    function changeClass() {
        var media = document.getElementById('media')
        if (media.paused) {
            media.play()
        } else {
            media.pause()
        }
    }
</script>
  <body style="background-color:#f1f1f1;">

    <div>
      <img src="images/002.png" style="position: fixed;width: 32px;z-index: 999;right:10" id="music" />
    </div>
    <script>
      var flag=0
 
      $('#music').click(function(){
        //  var media = document.getElementById('media')
        if(flag==0)
        {
          flag=1
          $('#music').attr('src','images/001.png')
          media.pause()
        }
        else{
          flag=0
          $('#music').attr('src','images/002.png')
          media.play()
        }

      })
    </script>
    <audio loop="loop" src="lz.MP3" id="media" preload="preload"></audio>

    <div>
  
  
  
      
  
      <section id="first" class="story" data-speed="10" data-type="background" style="background-position: 50% 00;">    	
 
  
        <div class="qq" data-type="sprite" data-offsety="0" data-xposition="50%" data-speed="2" ></div>
        <div class="title" data-type="sprite" data-offsety="0" data-xposition="50%" data-speed="-2" ></div>
      
          <article>
    

            <img src="images/one/5.png" style="width: 100%;position: absolute;z-index: 1;bottom: 0"/>
            <div style="width: 100%;display: flex;justify-content: center;align-items: center;flex-direction: column;">
            <img src="images/up.png" class="up"/>
            <div style="position: absolute;z-index: 1;bottom: 10;color:#fff">向上滑动</div>
            </div>
          </article>
        
      
      </section>
      <section id="second"  data-offsety="0" class="story" data-speed="200" data-type="background" style="background-position: 50% 0;">  



        <div class="title2" data-type="sprite" data-offsety="-100" data-xposition="50%" data-speed="-6" ></div>
         


        <div class="title3" data-type="sprite" data-offsety="-100" data-xposition="50%" data-speed="-6" ></div>


        <article>
    
          <img id="secondimg" src="images/second/8.png" style="width: 100%;z-index: 1;bottom: 0;position: absolute;" />

     
        </article>



    </section>


    <section id="third" class="story" data-offsety="0" data-speed="250" data-type="background" style="background-position: 50% 0px;">
  
      <div class="title1" data-type="sprite" data-offsety="-200" data-xposition="50%" data-speed="-6" ></div>
      <article>
       
        <img id="thirdimg" src="images/third/10.png" style="width: 100%;position: absolute;z-index: 1;bottom:0px;left: 0"  />


   
      </article>
    </section>



    <section id="fourth" class="story" data-offsety="0" data-speed="350" data-type="background" style="background-position: 50% 0px;">
  
      <div class="title1" data-type="sprite" data-offsety="-200" data-xposition="50%" data-speed="-9" ></div>
      <article>
        <img src="images/sex/18.png" style="width:100%;position: absolute;z-index: 1;bottom: 0px;left: 0"  />
   
      </article>


    </section>

    <section id="five" class="story" data-offsety="0" data-speed="350" data-type="background" style="background-position: 50% 0px;">
      <div class="title1" data-type="sprite" data-offsety="-260" data-xposition="50%" data-speed="-9" ></div>
      <article>
        <img id="fiveimg" src="images/seven/19.png" style="width:100%;position: absolute;z-index: 1;bottom:0px"  />

      </article>

  
    </section>

    <section id="sex" class="story" data-offsety="0" data-speed="450" data-type="background" style="background-position: 50% 0px;">
  
      <div class="title1" data-type="sprite" data-offsety="-400" data-xposition="50%" data-speed="-9" ></div>
      <article>
        <img id="seximg" src="images/fourth/13.png" style="width:60%;position: absolute;z-index: 1;bottom:0px"  />

      </article>
    </section>

    <section id="seven" class="story" data-offsety="0" data-speed="350" data-type="background" style="background-position: 50% 0px;">
  
      <div class="title1" data-type="sprite" data-offsety="-400" data-xposition="50%" data-speed="-9" ></div>
      <article>
        <img id="sevenimg" src="images/five/16.png" style="width:100%;position: absolute;z-index: 1;bottom:0px"  />

      </article>
 

    </section>

  

    <section id="eight" class="story" data-speed="8" data-offsety="200">    	

      <article style="display:  flex;justify-content: center;">
        <img src="images/eight/20.png" style="width:100%;position: absolute;z-index: 1;top:80px"  />
        <img src="images/eight/21.png" style="width:50%;z-index: 1;position: absolute; top:40%;z-index: 10" id="btn_call" />
        <img src="images/eight/22.png" style="width:100%;position: absolute;z-index: 1;bottom:0px"  />
      </article>
    </section>
 
    </div> 


  
    <script src="./js/script.js"></script>
  
    <script>
   $('#second').css({'background-image':'url("images/second/bg02.jpg")','background-size':'cover','top':'0','background-repeat':'no-repeat'});
   $('#third').css({'background-image':'url("images/third/bg03.jpg")','background-size':'cover','background-position-size':'center center','background-repeat':'no-repeat'});
   $('#sex').css({'background-image':'url("images/fourth/bg04.jpg")','background-size':'cover','background-position-size':'center center','background-repeat':'no-repeat'});
   $('#seven').css({'background-image':'url("images/five/bg05.jpg")','background-size':'cover','background-position-size':'center center','background-repeat':'no-repeat'});
   $('#fourth').css({'background-image':'url("images/sex/bg06.jpg")','background-size':'cover','background-position-size':'center center','background-repeat':'no-repeat'});
   $('#five').css({'background-image':'url("images/seven/bg07.jpg")','background-size':'cover','background-position-size':'center center','background-repeat':'no-repeat'});
   $('#eight').css({'background-image':'url("images/eight/bg08.jpg")','background-size':'cover','background-position-size':'center center','background-repeat':'no-repeat'});
 
   var screenHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
    console.log('屏幕高度: ' + screenHeight + 'px');
    if(screenHeight<850)
    {
       $('#secondimg').attr('src','images/second/81.png')
       $('#thirdimg').attr('src','images/third/101.png')
       $('#seximg').attr({'src':'images/fourth/131.png','style':'width:100%;position: absolute;z-index: 1;bottom:0px'})
       $('#sevenimg').attr('src','images/five/161.png')
       $('#fourthimg').attr('src','images/sex/181.png')
       $('#fiveimg').attr('src','images/seven/191.png')


    
    }

      $('#btn_call').click(function(){
        window.location.href='call.html'
      })
      $(window).scroll(function(){//为了保证兼容性，这里取两个值，哪个有值取哪一个　　
        var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;　　//scrollTop就是触发滚轮事件时滚轮的高度
        console.log(scrollTop)


   
      });
    </script>

  </body></html>